<template>
    <scroll-view 
        :scroll-y="true"
        class="add_ghd_view">
        <view class="container">
            <view class="title el-after">
                填写挂号单信息
            </view>
            <u-form :model="form" ref="uForm" label-width="fit-content">
                <u-form-item label="挂号单" prop="Rid">
                    <u-input v-model="form.Rid" :disabled="true"/>
                </u-form-item>
                <u-form-item label="卡号" prop="kid">
                    <u-input v-model="form.kid" />
                </u-form-item>
                <u-form-item label="姓名">
                    <u-input
                        placeholder="输入卡号后自动获取"
                        v-model="userName" 
                        :disabled="true"/>
                </u-form-item>
                <u-form-item label="号类" prop="IdType">
                    <SelectHaoLeiCp
                        v-model="form.IdType">
                    </SelectHaoLeiCp>
                </u-form-item>
                <u-form-item label="科室" prop="SectionRoom">
                    <SelectOfficeInputCp
                        v-model="form.SectionRoom"
                        @change="onOfficeChange">   
                    </SelectOfficeInputCp>
                </u-form-item>
                <u-form-item label="医师" prop="Doctor">
                    <SelectDocterInputCp
                        :office="form.SectionRoom"   
                        v-model="form.Doctor"
                        @change="onDocterChange">   
                    </SelectDocterInputCp>
                </u-form-item>
                <u-form-item label="挂单费" prop="GuaDanFei">
                    <u-input 
                        v-model="form.GuaDanFei"
                        placeholder="元"
                        :disabled="true"/>
                </u-form-item>
                <u-form-item label="其他费" prop="OtherFei">
                    <u-input 
                        v-model="form.OtherFei"
                        placeholder="元"
                        :disabled="true"/>
                </u-form-item>
                <u-form-item label="挂号日期" prop="ReristerTime"  label-width="150">
                    <SelectDateInputCp
                        v-model="form.ReristerTime">   
                    </SelectDateInputCp>
                </u-form-item>
                <u-form-item label="就诊日期" prop="SeeDoctorTime"  label-width="150">
                    <SelectDateInputCp
                        v-model="form.SeeDoctorTime">   
                    </SelectDateInputCp>
                </u-form-item>
                
                <view class="bt_list">
                    <u-button 
                        type="success"
                        @click="addData"
                        :loading="loading">
                        挂号
                    </u-button>
                </view>
            </u-form>
            <u-toast ref="uToast" />
        </view>
    </scroll-view>
</template>

<script>
//添加挂号单视图
import SelectOfficeInputCp from "@/components/public/SelectOfficeInput";
import SelectDocterInputCp from "@/components/public/SelectDocterInput";
import SelectDateInputCp from "@/components/public/SelectDateInput";
import SelectHaoLeiCp from "@/components/public/SelectHaoLei";
import {getTopRid,getPatientByKid,addRegister} from "@/common/api"
export default {
    components:{
        SelectOfficeInputCp,
        SelectDocterInputCp,
        SelectDateInputCp,
        SelectHaoLeiCp,
    },
    data() {
        return {
            loading:false,
            userName:'', //当前和挂号的病人姓名
            form: {
                Rid: '',
                kid: '',
                IdType: '',
                SectionRoom:'',
                Doctor:'',
                GuaDanFei:0,
                OtherFei:0,
                ReristerTime:'',
                SeeDoctorTime:'',
            },
            //数据验证规则
            rules:{
            	Rid:[
            		{
            			required: true,
            			message: '不能为空',
            			trigger: ['blur', 'change'],
            		}
            	],
                IdType:[
            		{
            			required: true,
            			message: '不能为空',
            			trigger: ['blur', 'change'],
            		}
            	],
                SectionRoom:[
                	{
                		required: true,
                		message: '不能为空',
                		trigger: ['blur', 'change'],
                	}
                ],
                Doctor:[
                	{
                		required: true,
                		message: '不能为空',
                		trigger: ['blur', 'change'],
                	}
                ],
                ReristerTime:[
                	{
                		required: true,
                		message: '不能为空',
                		trigger: ['blur', 'change'],
                	}
                ],
                SeeDoctorTime:[
                	{
                		required: true,
                		message: '不能为空',
                		trigger: ['blur', 'change'],
                	}
                ],
            },
        }
    },
    onReady() {
    	this.$refs.uForm.setRules(this.rules);
    },
    created(){
        this.getRid(); //获取挂单号
    },
    watch:{
        'form.kid'(newValue){
            this.getUserBykid(newValue);
        },
    },
    methods: {
        getRid(){ //获取挂单号
            getTopRid().then(data=>{
                this.form.Rid = data;
            }).catch(()=>{               
                return;
            });
        },
        getUserBykid(kid){ //根据卡号获取病人信息
            getPatientByKid(
                kid,
            ).then(data=>{
                this.userName = data.name;
            }).catch(()=>{
                this.userName = '';
                return;
            });
        },
        addData(){ //添加挂号单数据
            this.$refs.uForm.validate(valid => {
                if (valid) {
                    if(!this.userName){
                        this.$refs.uToast.show({
                            title: "请输入正确的卡号",
                            position:'top',
                            type: 'error',
                        });
                        return;
                    }
                    this.loading = true;
                    addRegister(
                        {
                            ...this.form,
                            Status:0,
                        },
                    ).then(data=>{
                        this.$refs.uToast.show({
                            title: "挂号成功",
                            position:'top',
                            type: 'success',
                        });
                        //成功后返回上一个页面
                        setTimeout(()=>{
                            uni.navigateBack();
                        },1000);
                    }).catch(msg=>{
                        this.$refs.uToast.show({
                            title: msg,
                            position:'top',
                            type: 'error',
                        });
                    }).finally(()=>{
                        this.loading = false;
                    });
                }
            });
        },
        onOfficeChange(data){ //科室选择后调用
            this.form.Doctor = '';//清空医师
            this.form.GuaDanFei = data.Sprice; //写入挂单费
        },
        onDocterChange(data){ //医师选择后调用
            
        },
    },    
}
</script>
<style scoped lang="scss">
    .add_ghd_view{
        height: calc(100vh);
        .container{
            padding: 35rpx;
            box-sizing: border-box;
            .title{
                width: fit-content;
                font-size: 45rpx;
                color: #000000;
                font-weight: bold;
                margin-bottom: 20rpx;
            }
            .bt_list{
                margin-top: 35rpx;
            }
        }
    }
</style>
